<!-- StudyPlanAddCourse_Frame.html -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>选课课程列表</title>
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" href="../../css/weui.min.css">
		<link rel="stylesheet" href="../../css/jquery-weui.min.css">
		<link rel="stylesheet" href="../../css/mui.min.css"/>
		<link rel="stylesheet" href="../../css/base.css"/>
		<link rel="stylesheet" href="../../css/CFNetPP_Base.css">
		<style type="text/css">
			.mui-table-view{
				margin-left: 0;
			}
			.mui-table-view-cell>a:not(.mui-btn){
				padding: 10px;
			}
			.mui-table-view-cell>a:not(.mui-btn) .course-img{
				display:block;
				width: 136px;
				max-width: 136px;
				height: 84px;
				background-image: url(../../image/course_placehoder.png);
				background-size: 136px 84px;
			}
			.mui-table-view-cell .top-content{
				height: 40px;
			}
			.mui-table-view-cell .bottom-content{
				/*padding-top: 16px;*/
				height: 44px;
			}
			.mui-table-view-cell>a:not(.mui-btn) .course_title{
				overflow: hidden;
			 	text-overflow: ellipsis;
			 	white-space: pre-wrap;
			 	display: -webkit-box;
			 	-webkit-line-clamp: 2;
			 	-webkit-box-orient: vertical;
			 	font-size: 14px;
			 	color: #222;
			 	/*line-height: 24px;*/
			}
			.mui-table-view-cell>a:not(.mui-btn) .subtitle{
				color: #999;
				font-size: 12px;
				overflow: hidden;
				white-space: normal;
			 	text-overflow: ellipsis;
			 	line-height: 16px;
			}
			/*.subtitle .right-span{
				margin-left: 10px;
			}*/
			.subtitle-red{
				color: #e10d20;
				font-size: 12px;
				margin: 0;
			}
			.cell-btn{
				font-size: 12px;
			    font-weight: 400;
			    line-height: 1.2;
			    padding: 4px 6px;
			    border-color: #1da4e8;
			    background-color: #1da4e8;
			    color: white;
			    width: 70px;
			}	
			.cell-btn:enabled:active{
				background-color: #2db4f8;
			}
			.bottom-content .cell-content-left{
				padding-right: 68px;
				float: left;
			}
			.bottom-content .cell-content-right{
				padding-top: 10px;
				width: 68px;
				height: 42px;
				float: right;
				position: absolute;
				right: 10px; 
				top: 50px;
			}
			.button-super-div{
				padding: 2px 0;
			}
			.course-status-tag{
				position: absolute;
				bottom: 10px;
				left: 10px;
				font-size: 12px;
				color: white;
				padding: 2px 4px;
				line-height: 1em;
				width: 136px;
				background-color: rgba(0,0,0,0.5);
				text-align: center;
			}
			.course-status-tag-red{
				background-color: #EC1A2B;
			}
			.course-status-tag-green{
				background-color: #1DBF53;
			}
			.tag-img{
				width: 12px;
				height: 12px;
				margin-right: 4px;
			}
			.cell-btn{
				margin-right: 10px;
			}
			.info-span{
				margin-left: 10px;
			}
			.mui-table-view .mui-media-object.mui-pull-left{
				margin-right: 12px;
			}
			.top-p{
				margin-top: 4px;
			}
			.bottom-p{
				margin-top: 6px;
			}
			.mui-table-view-cell{
				padding: 10px;
			}
			.mui-table-view-cell.mui-checkbox.mui-left, .mui-table-view-cell.mui-radio.mui-left{
				padding-left: 50px;
			}
			.mui-checkbox input[type=checkbox]:before, .mui-radio input[type=radio]:before{
			    position: absolute;
			    top: 28px;
			    left: -10px;
			}
			.mui-checkbox input[type=checkbox]:checked:before, .mui-radio input[type=radio]:checked:before{
				color: #18b4ed;
			}
			.add-btn{
				color: white;
				background-color: #18b4ed;
				border-color: #18b4ed;
				margin-top: 10px;
			}
			.add-btn:enabled:active{
				background-color: #08a4dd;
				border-color: #08a4dd;
			}
			.base_icon{
				width: 20px;
				margin-top: 12px;
			}
			.bottom-div{
				height: 40px;
				width: 100%;
				position: fixed;
				bottom: 0;
				left: 0;
			}
			.bottom-checkbox input[type=checkbox]:before{
			    position: absolute;
			    top: 0;
			    left: -10px;
			}
			.bottom-left-div{
				margin-right: 100px;
				line-height: 24px;
				font-size: 14px;
				color: #222;
			}
			.bottom-right-div{
				width: 100px;
				float: right;
				font-size: 16px;
				background-color: #18b4ed;
				text-align: center;
				line-height: 40px;
				color: white;
			}
			.base_navigation_bar,#BarAppearance {
				z-index: 1;
			}
			.top-right-p{
				float: right;
			}
			.top-left-p{
				float: left;
			}
			.search-div{
				margin-left: 54px;
				width: calc(100% - 74px);
			}
			.mui-input-clear[type=search]{
				margin-top: 6px;
				margin-bottom: 0;
				background-color: white;
				color: #222;
				border-radius: 15px;
				height: 30px;
				font-size: 14px;
				text-align: left;
			}
			.search-icon{
				width: 20px;
				position: absolute;
				left: 4px;
				top: 11px;
			}
			.mui-table-view-cell>a:not(.mui-btn){
				margin: -10px;
			}
			.price-span{
				color: #f80013;
			}
			.bottom-subtitle{
				color: #18b4ed;
			}
			.weui_btn_dialog.primary {
			    color: #18b4ed;
			}
			.weui_dialog_ft a {
			    color: #18b4ed;
			}
			.add-btn{
				color: white;
				background-color: #18b4ed;
				border-color: #18b4ed;
				margin-top: 10px;
			}
			.add-btn:enabled:active{
				background-color: #08a4dd;
				border-color: #08a4dd;
			}
			.base_icon{
				width: 20px;
				margin-top: 12px;
			}
			.bottom-div{
				height: 40px;
				width: 100%;
				position: fixed;
				bottom: 0;
				left: 0;
			}
			.bottom-checkbox input[type=checkbox]:before{
			    position: absolute;
			    top: 0;
			    left: -10px;
			}
			.bottom-left-div{
				margin-right: 100px;
				line-height: 24px;
				font-size: 14px;
				color: #222;
			}
			.bottom-right-div{
				width: 100px;
				float: right;
				font-size: 16px;
				background-color: #18b4ed;
				text-align: center;
				line-height: 40px;
				color: white;
			}
			.base_navigation_bar,#BarAppearance {
				z-index: 1;
			}
			.top-right-p{
				float: right;
			}
			.top-left-p{
				float: left;
			}
			.search-div{
				margin-left: 54px;
				width: calc(100% - 74px);
			}
			.mui-input-clear[type=search]{
				margin-top: 6px;
				margin-bottom: 0;
				background-color: white;
				color: #222;
				border-radius: 15px;
				height: 30px;
				font-size: 14px;
				text-align: left;
			}
			.search-icon{
				width: 20px;
				position: absolute;
				left: 4px;
				top: 11px;
			}
			.down-img{
				position: absolute;
				right: 10px;
				top: 10px;
				width: 18px;
			}
			.zhanwei-span{
				width: 16px;
			}
			.bottom-div{
				position: fixed;
				left: 0;
				bottom: 0;
				height: 50px;
				width: 100%;
				text-align: center;
			}
			.bottom-div-p{
				line-height: 50px;
				color: white;
				background-color: #18b4ed;
				margin: 0;
			}
			.top-add-course-div{
				padding: 10px;
			}
			.top-add-course-content{
				height: 29vw;
				width: 100%;
			}
			.course-box{
				width: 29vw;
				height: 29vw;
				float: left;
				position: relative;
			}
			.right-course-box{
				margin-left: 3.3%;
			}
			.delete-btn-img{
				position: absolute;
				right: -8px;
				top: -8px;
				width: 20px;
				height: 20px;
			}
			.selected-course-img{
				display: block;
				width: 29vw;
				height: 29vw;
			}
			.selected-course-title{
				margin: 0;
				color: white;
				background-color: rgba(0,0,0,0.5);
				position: absolute;
				left: 0;
				bottom: 0;
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
				padding: 0 6px;
				width: 100%;
				font-size: 12px;
				text-align: left;
				height: 20px;
				line-height: 20px;
			}
			.top-content{
				margin-right: 40px;
			}
			.cell-top-right-div{
				position: absolute;
				right: 10px;
				top: 10px;
				width: 40px;
				height: 28px;
			}
			.course-box-content{
				position: relative;
			}
			.add-btn-img{
				width: 30px;
				position: absolute;
				top: 4px;
				right: 0;
			}
			.added-span{
				width: 40px;
				background-color: #b9b9b9;
				color: white;
				line-height: 18px;
				margin-top: 4px;
				font-size: 10px;
				text-align: center;
				border-radius: 2px;
			}
			.hide-class{
				display: none;
			}
			.zhan-wei-div{
				height: 50px;
			}
			.category-list-div{
				position: absolute;
				top: 40px;
				left: 0;
				width: 100%;
				z-index: 2;
				display: none;
			}
			.category-list-div .mui-table-view{
				background-color: rgba(0,0,0,0);
			}
			.category-list-div .mui-table-view-cell{
				padding: 6px 10px;
			}
			.category-list-div .mui-table-view-cell{
				background-color: rgba(0,0,0,0.5);
				color: white;
			}
			.category-list-div .selected-cell{
				color: #18b4ed;
			}
			.category-list-div .mui-table-view-cell:after{
				background-color: white;
			}
			.course-category-div{
				position: relative;
			}
		</style>
	</head>
	<body>
		<div class="top-add-course-div"  hidden="hidden">
			<div id="selected_courses_div" class="top-add-course-content">
				<!-- <div class="course-box">
					<div class="course-box-content">
						<img class="selected-course-img" src="../../image/list-default.png">
						<p class="selected-course-title">
							我很长很1
						</p>
					</div>
					<img class="delete-btn-img" src="../../icon/delete_xuanze.png">
				</div>
				<div class="course-box right-course-box">
					<div class="course-box-content">
						<img class="selected-course-img" src="../../image/list-default.png">
						<p class="selected-course-title">
							我很长很2
						</p>
					</div>
					<img class="delete-btn-img" src="../../icon/delete_xuanze.png">
				</div>
				<div class="course-box right-course-box">
					<div class="course-box-content">
						<img class="selected-course-img" src="../../image/list-default.png">
						<p class="selected-course-title">
							我很长很3
						</p>
					</div>
					<img class="delete-btn-img" src="../../icon/delete_xuanze.png">
				</div> -->
			</div>
		</div>
		<div class="course-category-div">
			<ul class="mui-table-view">
	    		<li class="mui-table-view-cell">
	    			<p id="category_select" class="top-right-p base_dark_grey base_content_font" onclick="onSelectCategoryClick()">
	    				分类：<span id="selected_category">我的课程</span>
	    				<span class="zhanwei-span"></span>
	    				<img class="down-img" src="../../image/icon_category_down.png">
	    			</p>
	    			<p class="top-left-p base_dark_grey base_content_font">
	    				共<span id="course_num">0</span>门课程
	    			</p>
	    		</li>
	    	</ul>
	    	<div class="category-list-div">
	    		<ul id="category_list" class="mui-table-view">
		    		<li id="0" class="category-cell mui-table-view-cell base_content_font base_dark_grey">
		    			全部
			    	</li>
			    	<li id="1" class="category-cell mui-table-view-cell base_content_font base_dark_grey selected-cell">
		    			我的课程
			    	</li>
			    	<li id="2" class="category-cell mui-table-view-cell base_content_font base_dark_grey">
		    			其他课程
			    	</li>
			    	<li id="3" class="category-cell mui-table-view-cell base_content_font base_dark_grey">
		    			公共课程
			    	</li>
			    	<!-- <li id="4" class="category-cell mui-table-view-cell base_content_font base_dark_grey">
		    			推送课程
			    	</li> -->
		    	</ul>
	    	</div>
		</div>
		<div class="course-list-div">
			<ul id="tesacherTableView" class="mui-table-view">
				<!-- <li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<p class="course-status-tag">已结束</p> 
						<img class="mui-media-object mui-pull-left course-img" src="../../image/list-default.png"/>
						<div class="mui-media-body top-content">
							<p class="course_title">课程名称</p>
							<div class="cell-top-right-div">
								<img class="add-btn-img hide-class" src="../../image/icon_course_add.png">
								<span class="added-span">已选</span>
							</div>
						</div>
						<div class="mui-media-body bottom-content">
							<div class="top-p">
								<p class="mui-ellipsis subtitle">
									<span class="left-span">
									</span>
								</p>
							</div>
							<div class="bottom-p">
								<p class="mui-ellipsis subtitle">
									<span class="left-span">
										课程类型 : <span>网站运营</span>
									</span>
								</p>
							</div>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<p class="course-status-tag">已结束</p> 
						<img class="mui-media-object mui-pull-left course-img" src="../../image/list-default.png"/>
						<div class="mui-media-body top-content">
							<p class="course_title">课程名称</p>
							<div class="cell-top-right-div">
								<img class="add-btn-img" src="../../image/icon_course_add.png">
								<span class="added-span hide-class">已选</span>
							</div>
						</div>
						<div class="mui-media-body bottom-content">
							<div class="top-p">
								<p class="mui-ellipsis subtitle">
									<span class="left-span">
									</span>
								</p>
							</div>
							<div class="bottom-p">
								<p class="mui-ellipsis subtitle">
									<span class="left-span">
										课程类型 : <span>网站运营</span>
									</span>
								</p>
							</div>
						</div>
					</a>
				</li> -->
			</ul>
			<div class="noSign" hidden="hidden" id="noData">
				<img src="../../image/icon_img.png" width="60%">
				<p class="font16 top_15 base_dark_grey" >
					暂无数据
				</p>
			</div>
			<div class="loadFailure" hidden="hidden" id="noNet">
				<img src="../../image/icon_img01.png" width="60%">
				<p class="" >
					数据加载失败
				</p>
				<p>
					请检查您的网络
				</p>
				<button type="button" class="mui-btn mui-btn-outlined" onclick="refreshData()">
					重新加载
				</button>
			</div>
		</div>
		<div class="zhan-wei-div bottom-tool"></div>
		<div class="bottom-div bottom-tool" onclick="onNextClick();">
			<p class="bottom-div-p">
				下一步
			</p>
		</div>
	</body>
	<script type="text/javascript" src="../../script/jquery.min.js"></script>
	<!-- <script type="text/javascript" src="../../script/jquery-weui.min.js"></script> -->
	<script type="text/javascript" src="../../script/mui.min.js"></script>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/MD5.js"></script>
	<script type="text/javascript" src="../../script/requestTool.js"></script>
	<script type="text/javascript" src="../../script/common.js"></script>
	<script type="text/javascript">
		var courseArr = new Array();
		var addedArr = new Array();//已经添加的课程数组
		var keyword = '';
		var categoryid = '1';
		var dropRefreshCount = 0;
		var page = 1;
		var rows = 10;
		var firstLoad = true;
		apiready = function(){
			loadNewData();
			loadAddedData();
			setPullUpRefresh();
			setupNotifi();
			setupCategoryClick();
			setupPageType();
			sendBuriedNotifi('0', '添加学习计划课程页', '217')
		}
		function sendBuriedNotifi(busionessid, pagetype, pagetypeid) {
			var userinfo = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				uname : $api.getStorage('cfnetppusername'),
			}
			var data = {
				busionessid : busionessid,
				pagetype : pagetype,
				pagetypeid : pagetypeid,
				sourceurl : api.pageParam.sourceurl,
				sourcetitle : api.pageParam.sourcetitle,
				accesspageurl : window.location.pathname,
				accesspagetitle : document.title,
				userinfo : userinfo
			}
			SendBehaviorTrajectoriesNotifi_Study(data);
		}
		//设置页面类型：编辑/创建
		function setupPageType(){
			if (api.pageParam.planType == 'edit') {//编辑模式
				setupEditUI();
			}
		}
		//设置编辑模式下的页面UI
		function setupEditUI(){
			$('.bottom-tool').hide();
		}
		function setupCategoryClick(){
			$('.category-cell').unbind('click');
			$('.category-cell').click(function(event){
				event.stopPropagation();
				$('.category-list-div').hide();
				var currentCategoryId = $(this).attr('id');
				var currentCategoryTitle = $(this).text();
				$('.category-cell').removeClass('selected-cell');
				$('#'+currentCategoryId).addClass('selected-cell');
				categoryid = currentCategoryId;
				$("#selected_category").text(currentCategoryTitle);
				loadNewData();
			});
		}
		function onSelectCategoryClick(){
			$('.category-list-div').toggle();
		}
		//准备数据
		function loadAddedData(){
			var param = {
				pid : api.pageParam.pid,
				jid : $api.getStorage('cfnetppjxid')
			};
			cfnetppPOST(url_planCourseList, param, true, function(data, status) {
				if (status == 'success') {
					if (data.status == true) {
						var courseList = data.data;
						if (courseList != null && courseList.constructor == Array && courseList.length > 0) {
							addedArr = courseList;
							setupSelectedCourses();
						}
					} 
				} 
			});
		}
		function setupNotifi(){
			api.addEventListener({
			    name: 'searchPlanCourseNotifi'
			}, function(ret, err) {
			    keyword = ret.value.keyword;
			    refreshData();
			});
			api.addEventListener({
			    name: 'planCourseCategoryNotifi'
			}, function(ret, err) {
			    categoryid = ret.value.currentCategoryId;
			    refreshData();
			});
			api.addEventListener({
			    name: 'searchPlanCourseNotifi'
			}, function(ret, err) {
			    $('.category-cell').removeClass('selected-cell');
			    $('#0').addClass('selected-cell');
			});
		}
		function loadNewData() {
			page = 1;
			loadData();
		}
		function loadMoreData() {
			page++;
			loadData();
		}
		//下拉刷新
		function setRefreshHeader() {
			api.setRefreshHeaderInfo({
				visible : true,
				bgColor : '#ccc',
				textColor : '#fff',
				textDown : '下拉刷新...',
				textUp : '松开刷新...',
				showTime : true
			}, function(ret, err) {
				loadNewData();
			});
		}
		// 上拉加载
		function setPullUpRefresh() {
			api.addEventListener({
				name : 'scrolltobottom'
			}, function(ret, err) {
				if (dropRefreshCount >= rows) {
					loadMoreData();
				}
			});
		}
		function loadData(){
			if (firstLoad == true) {
				api.showProgress({
				    style: 'default',
				    animationType: 'fade',
				    title: '加载中...',
				    text: '',
				    modal: false
				});
				firstLoad = false;
			}
			var param = {
				pid : api.pageParam.pid,
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				keyword : keyword,
				type : categoryid,
				page : page,
				rows : rows
			};
			cfnetppPOST(url_planSearchCourseList, param, true, function(data, status) {
				api.refreshHeaderLoadDone();
				api.hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						if (page == 1) {
							var total = data.data.total;
							if (total != null) {
								$("#course_num").text(total);//设置搜索条数
							}
						}
						var courseList = data.data.list;
						if (courseList != null && courseList.constructor == Array && courseList.length > 0) {
							dropRefreshCount = courseList.length;
							if (page == 1) {
								courseArr = new Array();
							}
							var oldCount = courseArr.length;//旧的数组长
							courseArr = courseArr.concat(courseList);
							var htmlString = "";
							for (var i = oldCount; i < courseArr.length; i++) {
								var courseData = courseArr[i];
								htmlString += courseHtmlWithData(courseData, i);
							}
							if (page == 1) {
								$('#tesacherTableView').html(htmlString);
							}else{
								$('#tesacherTableView').append(htmlString);
							}
							// addCellClick();
							$('#noData').hide();
							$('#noNet').hide();
						}else{
							if (page == 1) {
								$("#course_num").text(0);//设置搜索条数
								$('#tesacherTableView').html('');
								$('#noData').show();
								$('#noNet').hide();
							}
						}
					} else {
						if (page == 1) {
							$("#course_num").text(0);//设置搜索条数
							$('#tesacherTableView').html('');
							$('#noData').show();
							$('#noNet').hide();
						}else{
							// api.toast({
							// 	msg : '获取数据失败'
							// });
						}
					}
				} else {
					if (page == 1) {
						$('#tesacherTableView').html('');
						$('#noData').hide();
						$('#noNet').show();
					}else{
						api.toast({
							msg : '网络异常'
						});
					}
				}
			});
		}
		//添加点击事件
		function addCellClick(){
			$('.mui-table-view-cell').unbind('click');
			$('.mui-table-view-cell').click(function(){
				return;
				var index = $(this).attr('index');
				var courseData = courseArr[parseInt(index)];
				var message = "是否添加课程《" + courseData.coursename + "》到该学习计划?";
				$.confirm(message, "添加确认", function() {
					addCourse(courseData);
		        }, function() {
		          //取消操作
		        });
			});
		}
		function onCourseClick(index){
			return;
			var courseData = courseArr[parseInt(index)];
			var message = "是否添加课程《" + courseData.coursename + "》到该学习计划?";
			$.confirm(message, "添加确认", function() {
				addCourse(courseData);
	        }, function() {
	          //取消操作
	        });
		}
		function setupSelectedCourses(){
			if (addedArr.length > 0) {
				$('.top-add-course-div').show();
				var addedCourseHtmlString = '';
				for (var i = 0; i < addedArr.length; i++) {
					if (i >= 3) {
						break;
					}
					var courseData = addedArr[i];
					addedCourseHtmlString += addedCourseHtml(courseData, i);
				}
				$('#selected_courses_div').html(addedCourseHtmlString);
			}else{
				$('.top-add-course-div').hide();
			}
		}
		function addedCourseHtml(data, index){
			var rightCourseBoxClass = 'right-course-box';
			if (index == 0) {
				rightCourseBoxClass = '';
			}
			return '<div id="addedCourse'+data.id+'" class="course-box '+rightCourseBoxClass+'">'+
					'<div class="course-box-content">'+
						'<img class="selected-course-img" src="'+imageUrlWithStr(data.coverimages)+'">'+
						'<p class="selected-course-title">'+
							data.coursename+
						'</p>'+
					'</div>'+
					'<img class="delete-btn-img" index="'+index+'" onclick="onDeleteClick('+index+')" src="../../icon/delete_xuanze.png">'+
				'</div>';
		}
		function onDeleteClick(index){
			var courseData = addedArr[parseInt(index)];
			if (courseData.courseid == null) {
				courseData.courseid = courseData.id;
			}
			var btnArray = ['取消', '确定'];
			mui.confirm('是否确认删除该课程?', '提示', btnArray, function(e) {
				if (e.index == 1) {
					deleteCourse(courseData, index, function(ret, data, i){
						if (ret == true) {
							addedArr.splice(parseInt(index), 1);
							$('#addBtn'+data.id).removeClass('hide-class');
							$('#addedSpan'+data.id).addClass('hide-class');
							setupSelectedCourses();
						}
					});	
				}
			});
		}
		function deleteCourse(courseData, index, callback){
			api.showProgress({
			    style: 'default',
			    animationType: 'fade',
			    title: '',
			    text: '删除课程中',
			    modal: false
			});
			var param = {
				ids : $api.getStorage('cfnetppuid'),
				cids : courseData.courseid,
				pid : api.pageParam.pid
			};
			cfnetppPOST(url_delPlanCourse, param, false, function(data, status){
			  SendBusinessOperationsLogNotifi('老师删除学习计划下课程', '217', param, param, '', data, '老师删除学习计划下课程接口', '217-02');
				api.hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						api.toast({
						    msg: '删除成功'
						});
						//刷新课程列表
						api.sendEvent({
						    name: 'refreshTeacherCourseListNotifi'
						});
						callback(true, courseData, index);
					}else{
						api.toast({
						    msg: '删除失败，请重试'
						});
						callback(false);
					}
				}else{
					api.toast({
					    msg: '删除失败，请重试'
					});
					callback(false);
				}
			});
		}
		function addCourseClick(event, index){
			var courseData = courseArr[parseInt(index)];
			if (addedArr.length >= 3) {
				api.toast({
				    msg: '一个学习计划最多添加3门课程！'
				});
				return;
			}
			addCourse(courseData, function(ret, cData){
				if (ret == true) {
					addedArr.push(cData);
					$('#addBtn'+cData.id).addClass('hide-class');
					$('#addedSpan'+cData.id).removeClass('hide-class');
					setupSelectedCourses();
				}
			});
			event.stopPropagation();
		}
		function addCourse(courseData, callback){
			api.showProgress({
			    style: 'default',
			    animationType: 'fade',
			    title: '',
			    text: '添加课程中',
			    modal: false
			});
			var params = {
				pid : api.pageParam.pid,
				cid : courseData.id,
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid')
			};
			cfnetppPOST(url_addPlanCourse, params, false, function(data, status){
			     SendBusinessOperationsLogNotifi('老师添加学习计划下课程', '217', params, params, '', data, '老师添加学习计划下课程接口', '217-01');
				api.hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						api.toast({
						    msg: '添加课程成功'
						});
						api.sendEvent({
						    name: 'addPlanCourseSucceedNotifi',
						    extra: courseData
						});
						api.sendEvent({
						    name: 'refreshTeacherCourseListNotifi'
						});
						if (callback) {
							callback(true, courseData);
						}
					}else if(data.code == 103){
						api.toast({
						    msg: '学习计划下已存在该课程'
						});
						if (callback) {
							callback(false);
						}
					}else{
						api.toast({
						    msg: '添加课程失败'
						});
						if (callback) {
							callback(false);
						}
					}
				}else{
					api.toast({
					    msg: '添加课程失败'
					});
					if (callback) {
						callback(false);
					}
				}
			});
		}
		//时间标签
		function timeTitleWithEndTime(endTime){
			var timeTitleHtml = '';
			var etime = parseInt(endTime) * 1000;//结束时间
			var nowTime = Date.parse(new Date());
			// alert("结束时间"+etime+'\n当前时间'+nowTime);
			if (etime <= nowTime) {
				timeTitleHtml = '<p class="course-status-tag">已结束</p>';
			}else{
				var tmpTime = etime - nowTime;
				if (tmpTime <= oneWeek) {
					var timeDate = new Date(etime);
					var timeMonth = timeDate.getMonth() + 1;
					var timeDay = timeDate.getDate();
					var timeTitle = timeMonth + '-' + timeDay + '到期';
					timeTitleHtml = '<p class="course-status-tag">' + timeTitle + '</p>';
				}
			}
			return timeTitleHtml;
		}
		function courseHtmlWithData(data, index){
			return '<li id="'+data.id+'" index="'+index+'" onclick="onCourseClick('+index+')" class="mui-table-view-cell mui-media">'+
				'<a href="javascript:;">'+
					'<img class="mui-media-object mui-pull-left course-img" src="'+imageUrlWithStr(data.coverimages)+'"/>'+
					'<div class="mui-media-body top-content">'+
						'<p class="course_title">'+data.coursename+'</p>'+
						'<div class="cell-top-right-div">'+
							'<img id="addBtn'+data.id+'" onclick="addCourseClick(event, '+index+')" class="add-btn-img" src="../../image/icon_course_add.png">'+
							'<span id="addedSpan'+data.id+'" class="added-span hide-class">已选</span>'+
						'</div>'+
					'</div>'+
					'<div class="mui-media-body bottom-content">'+
						'<div class="top-p">'+
							'<p class="mui-ellipsis subtitle">'+
								'<span class="left-span">'+
								'</span>'+
							'</p>'+
						'</div>'+
						'<div class="bottom-p">'+
							'<p class="mui-ellipsis subtitle">'+
								'<span class="left-span">'+
									'课程类型 : <span>'+categoryNameWithData(data)+'</span>'+
								'</span>'+
							'</p>'+
						'</div>'+
					'</div>'+
				'</a>'+
			'</li>';
		}
		function categoryNameWithData(data){
			var categoryname = data.categoryname;
			if (categoryname == null) {
				categoryname = '无';
			}
			return categoryname;
		}
		function minuteWithSecond(second){
			// return (parseInt(second) / 60).toFixed(0);//该方法会四舍五入
			return parseInt(parseInt(second) / 60);
		}
		function imageUrlWithStr(string){
			if (string.indexOf("http://") == -1) {
				// if (string.indexOf("learn/") == -1) {
				// 	return 'http://bos.cfnet.org.cn/' + string;
				// }else{
					return 'http://cfnet.org.cn/data/uploads/' + string;
				// }
			}else{
				return string;
			}
		}
		function refreshData(){
			firstLoad = true;
			loadNewData();
		}
		function numNullStr(str){
			if (str == null || str == '' || str == undefined || str < 0) {
				return 0;
			}
			return str;
		}
		function onNextClick(){
		    sendBuriedNotifi('1', '添加学习计划课程页', '217')
			api.openWin({useWKWebView:true,
			    name: 'StudyCreatTeamNew_Win',
			    url: 'StudyCreatTeamNew_Win.html',
			    pageParam: api.pageParam
			});
		}
	</script>
</html>